<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>:after 选择器</title>
		<!-- :after 伪元素在元素之后添加内容。
			这个伪元素允许创作人员在元素内容的最后面插入生成内容。默认地，
			这个伪元素是行内元素，不过可以使用属性 display 改变这一点。
			与before 想对
			-->
		<style type="text/css">
			

			ul>li:after {
				content: "插入的内容";
				/* 被插入的内容的其他属性 */
				background: #33CCCC;
				
			}
		</style>

	</head>
	<body>

		<p><a href="#id01">跳转到内容1</a></p>
		<p><a href="#id02">跳转到内容2</a></p>
		<ul>
			<li>1</li>
			<li>2</li>
			<li>3</li>
		</ul>
		<p id="id01"><b>内容1</b></p>
		<p id="id02"><b>内容2</b></p>


	</body>
</html>
